<template>
  <div class="page bgc-fff">
    <x-header title="挂车信息"></x-header>
    <div class="main mt46">
      <div class="pad-l-r20 pad-t-b20 f14 c-333">
        <!--车牌号-->
        <div class="flex l-center a-between">
          <div class="flex l-start a-left">
            <span class="c-999 ta-l">挂车车牌号：</span>
            <span class="ta-l" v-if="tarrierPlate">{{tarrierPlate}}</span>
            <span v-else>暂无</span>
          </div>
          <div class="flex l-start a-left">
            <span class="c-999 ta-l">挂车类型：</span>
            <span class="ta-l" v-if="trailerTypeName">{{trailerTypeName}}</span>
            <span v-else>暂无</span>
          </div>
        </div>
      </div>
    </div>
    <!-- loading -->
    <v-loading  v-show="loadingShow"></v-loading>
  </div>
</template>

<script type="text/ecmascript-6">
  import { XHeader, Toast } from 'vux'
  import * as DirverApi from '@/api/dirver'
  import Loading from '@/components/common/loading/loading'
  import * as ThreeStorage from '@/utils/store/token.js'
  export default {
    name: 'me-driverCarrier',
    data() {
      return {
        driver_Id: '',
        tarrierPlate: '',
        trailerTypeName: '',
        loadingShow: false // loading显隐
      }
    },
    components: {
      XHeader,
      'v-loading': Loading
    },
    created() {
      this.driver_Id = ThreeStorage.getDriverId()
      this.getInfoInit()
    },
    mounted() {
    },
    methods: {
      getInfoInit: function() {
        const that = this
        that.loadingShow = true
        DirverApi.getVehicle(this.driver_Id).then(res => {
          that.loadingShow = false
          if (res.code === 0) {
            that.tarrierPlate = res.data.trailerInfo.plate
            that.trailerTypeName = res.data.trailerInfo.trailerTypeName
          }
        }).catch(res => {
          that.loadingShow = false
          console.warn('error', res)
          Toast({
            message: res.message || '系统繁忙，请稍候再试',
            duration: 1500
          })
        })
      }
    }
  }
</script>

<style scoped>
  @import '../../styles/util.css';
</style>
